<template>
  <div class="app-container">
    <el-form
      v-show="show"
      :inline="true"
      :model="formInline"
      class="demo-form-inline"
    >
      <el-form-item>
        <el-input v-model="formInline.year" placeholder="请输入年份" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" :icon="Search" @click="onSubmit">
          搜索
        </el-button>
      </el-form-item>
    </el-form>

    <FunNavigation
      :isAdd="false"
      @showFn="show = !show"
      @refreshFn="listFn"
    ></FunNavigation>
    <el-table
      border
      header-cell-class-name="tableBackground"
      :data="list"
      stripe
      style="width: 100%"
    >
      <el-table-column prop="name" label="姓名" />
      <el-table-column prop="jobNumber" label="工号" />
      <el-table-column prop="year" label="年份" />
      <el-table-column prop="shouldPay" label="应发合计" />
      <el-table-column prop="welfare" label="福利费" />
      <el-table-column prop="allowance" label="津贴" />
      <el-table-column prop="totalPay" label="全部所得额" />
      <el-table-column prop="totalTaxPayed" label="应纳税所得额" />
      <el-table-column prop="diff" label="差额" />
      <el-table-column prop="tax" label="个税" />
      <el-table-column prop="actualPay" label="实际发放" />
      <el-table-column width="180" prop="addtime" label="添加时间">
        <template #default="scope">
          {{ parseTime(new Date(scope.row.createdAt).getTime()) }}
        </template>
      </el-table-column>
    </el-table>
    <div class="pages">
      <el-pagination
        background
        v-model:current-page="formInline.page"
        v-model:page-size="formInline.pageSize"
        layout=" total,sizes, prev, pager, next"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>
<script>
export default {
  name: 'yearEndBonusList',
}
</script>
<script setup>
import { postAdminyearEndBonusNew, postAddyearEndBonusNew } from '@/api/api'
import FunNavigation from '@/components/funNavigation/funNavigation.vue'
import importButton from '@/components/importButton/importButton.vue'
import { parseTime } from '@/utils'
import { Search, Refresh } from '@element-plus/icons-vue'
import { onMounted, reactive, ref, computed } from 'vue'
import { permission } from '@/hooks/permission'
import { exportExcel } from '@/utils/excel'
import { ElMessage } from 'element-plus'
import { useAccount } from '@/pinia/modules/account'
onMounted(() => {
  listFn()
})
const year = ref('')
const show = ref(true)
const formInline = reactive({
  page: 1,
  pageSize: 10,
  search: '',
  department: '',
  year: '',
  jobNumber: '',
  orderBy: {
    year: 0,
    jobNumber: 0,
  },
})

const list = ref([])
const total = ref(0)
const handleSizeChange = val => {
  formInline.pageSize = val
  listFn()
}

const handleCurrentChange = val => {
  formInline.page = val
  listFn()
}

async function listFn() {
  const { userinfo } = useAccount()
  const { data } = await postAdminyearEndBonusNew({
    ...formInline,
    jobNumber: userinfo.jobNumber,
  })
  list.value = data.list
  total.value = data.total
}

const onSubmit = () => {
  formInline.page = 1
  listFn()
}
async function setImage(e) {
  if (e.target.files.length > 0) {
    const file = e.target.files[0]
    console.log(file)
  }
}
async function importExcelFormServe() {
  const formData = new FormData()
  formData.append('file', file)
  // const { data } = await importExcel(formData)
  // listFn()
}
async function exportList() {
  const { data } = await postAdminyearEndBonusNew({
    ...formInline,
    page: 1,
    pageSize: 10000,
  })
  return data.list
}
async function statusFn(data) {
  await await yearEndBonusNewEditRemark({
    id: data.id,
    status: !data.status,
  })
  listFn()
}

async function exportExcelFormServe() {
  let list = await exportList()

  let dataList = list.map(item => {
    return {
      日期: item.year,
      姓名: item.name,
      工号: item.jobNumber,
      应发合计: item.shouldPay,
      福利费: item.welfare,
      津贴: item.allowance,
      个税: item.tax,
      实际发放: item.actualPay,
      全部所得额: item.totalPay,
      应纳税所得额: item.totalTaxPayed,
      差额: item.diff,
    }
  })
  console.log(dataList)
  exportExcel(dataList, '年终奖列表', 'sheetName')
}
async function onImportExcelForm1(e) {
  e.map(item => {
    let obj = item['基本信息']
    item['name'] = obj['姓名']
    item['jobNumber'] = obj['工号']
    item['year'] = obj['日期'].toString().substring(0, 4)
    item['diff'] = obj['扣除']
    delete item['基本信息']
  })
  e = e.sort((a, b) => (a.jobNumber > b.jobNumber ? 1 : -1))
  await postyearEndBonusNewListAdd(e)
  ElMessage.success('导入成功！')
  formInline.page = 1
  listFn()
}
async function onImportExcelForm(e) {
  e.map(item => {
    let obj = item['基本信息']
    item['name'] = obj['姓名']
    item['jobNumber'] = obj['工号']
    item['year'] = obj['日期'].toString().substring(0, 4)
    item['shouldPay'] = obj['应发合计']
    delete item['基本信息']
  })
  e = e.sort((a, b) => (a.jobNumber > b.jobNumber ? 1 : -1))
  await postAddyearEndBonusNew(e)
  // await postAddyearEndBonus(e)
  ElMessage.success('导入成功！')
  formInline.page = 1
  listFn()
}

async function blurRemark(item) {
  await yearEndBonusNewEditRemark({
    id: item.id,
    remark: item.remark,
  })
}
async function AllstatusFn(status, year) {
  await PutyearEndBonusNewUpdateStatus({
    status,
    year,
  })
  ElMessage.success('修改成功！')
  formInline.page = 1
  listFn()
}
</script>

<style>
.tableBackground {
  background: red;
}
</style>
